<template>
    <div class="users">
        <Crumbs :bread='bread'></Crumbs>
        <el-card>
             <el-table :data="tableData" border :stripe="true" style="width: 100%;" :header-cell-style="{
              textAlign: 'center',
              height: '40px',
          }">
        <el-table-column label="#" type="index">
        </el-table-column>
        <el-table-column prop="authName" label="权限名称">
        </el-table-column>
        <el-table-column prop="path" label="路径">
        </el-table-column>
    <el-table-column
      label="权限等级">
<template slot-scope="scope">
  <el-tag v-if="scope.row.level==0" type="primary" size="mini">一级</el-tag>
  <el-tag v-if="scope.row.level==1" type="success" size="mini">二级</el-tag>
  <el-tag v-if="scope.row.level==2" type="warning" size="mini">三级</el-tag>
</template>
    </el-table-column>
  </el-table>
        </el-card>
    </div>
</template>
<script>
import Crumbs from '@/components/crumbs.vue'
import {rights} from '../until/http.js'
export default {
   components:{Crumbs},
    data() {
        return {
            tableData:[],
            bread: [
        { id: 1, path: "", title: "权限管理" },
        { id: 2, path: "", title: "权限列表" },
      ]
        };
    },

    mounted() {
        this.setlist()
    },

    methods: {
        //列表渲染
        async setlist(){
            const {data:res}=await rights()
            this.tableData=res.data
        },

    },
};
</script>

<style  scoped>

</style>